doctype html
html(lang='zh_CN')
   head
      link(rel='stylesheet' href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css")
      link(rel='stylesheet' href="/stylesheets/sticky-footer-navbar.css")
      link(rel='stylesheet' href="/stylesheets/style.css")
      link(rel='icon' href='/images/favicon.ico')
      title Gikoo App Server
   body
      // 导航条 start
      nav.navbar.navbar-default.navbar-fixed-top
         .container
            .navbar-header
               a.navbar-brand Gikoo App Server
            .collapse.navbar-collapse
               p.navbar-text.navbar-right
                  |#{user.realname}
                  a#logout.navbar-link(href='javascript:void(0)') [退出]
      // 导航条 end
      .container
         .row
            ul.nav.nav-pills
               li.active(role='presentation')
                  a#ios(href='javascript:void(0)') iOS
               li(role='presentation')
                  a#android(href='javascript:void(0)') Android
               form.navbar-form.navbar-right(role='search')
                  .input-group
                     input.form-control(type='text' placeholder='Search')
                     span.input-group-btn
                        button.btn.btn-default(type='button')
                           span.glyphicon.glyphicon-search(aria-hidden='true')
         .row
            .panel.panel-default
               .panel-body
                  table.table.table-striped
                     thead
                        tr
                           td
                              b 应用名称
                           td
                              b 创建者
                           td
                              b 添加日期
                           td
                              b 操作
                     tbody
                        tr
                           td
                              a.app_name(style='color: inherit;') MPS4.0
                           td 伊小洛
                           td 2015-04-15
                           td
                              a(href='#' style='color: inherit;')
                                 span.glyphicon.glyphicon-duplicate(aria-hidden='true')
                              a(href='#' style='margin: 20px;color: inherit;')
                                 span.glyphicon.glyphicon-remove(aria-hidden='true')
                        tr
                           td
                              a.app_name(style='color: inherit;') MPS4.1
                           td 伊小洛
                           td 2015-04-15
                           td
                              a(href='#' style='color: inherit;')
                                 span.glyphicon.glyphicon-duplicate(aria-hidden='true')
                              a(href='#' style='margin: 20px;color: inherit;')
                                 span.glyphicon.glyphicon-remove(aria-hidden='true')
                        tr
                           td
                              a.app_name(style='color: inherit;') MPS4.2
                           td 伊小洛
                           td 2015-04-15
                           td
                              a(href='#' style='color: inherit;')
                                 span.glyphicon.glyphicon-duplicate(aria-hidden='true')
                              a(href='#' style='margin: 20px;color: inherit;')
                                 span.glyphicon.glyphicon-remove(aria-hidden='true')
                  .modal(id='appDetail' tabindex='-1' role='dialog' aria-labelledby='appDetail' aria-hidden='true')
                     .modal-dialog
                        .modal-content
                           .modal-header
                              button.close(type="button" data-dismiss="modal" aria-label="Close")
                                 span(aria-hidden="true") &times;
                              h4.modal-title(id="appDetail") sample title
                           .modal-body.app-detail-content
                              | app content
               .panel-footer
                  .row
                     .col-md-4.height-center
                        button.btn.btn-default.btn-sm(type='button' data-toggle='modal' data-target="#uploadModal")
                           span.glyphicon.glyphicon-plus(aria-hidden="true") 添加新应用
                        .modal(id='uploadModal' tabindex='-1' role="dialog" aria-labelledby="uploadModal" aria-hidden="true")
                           .modal-dialog
                              .modal-content
                                 .modal-header
                                    button.close(type="button" data-dismiss="modal" aria-label="Close")
                                       span(aria-hidden="true") &times;
                                    h4.modal-title(id="uploadModal") 上传应用
                                 .modal-body
                                    .row
                                       .col-md-4
                                          input.form-control(id="appName" type="text" placeholder="Input app name")
                                    .row(style="margin-top: 15px; position: relative")
                                       .col-xs-4
                                          span.btn.btn-success.fileinput-button
                                             span.glyphicon.glyphicon-plus
                                             span 添加文件
                                             input(id="fileupload" type="file" multiple="" name="files" data-url="/workstation/app/")
                                       .col-xs-4.col-xs-offset-4.text-right
                                          button.btn.btn-primary(id="startUpload") 创建
                                    .row(style="margin-top: 25px; position: relative")
                                        .col-xs-12(id="selected_files")
                                    .row(id="progress" style="margin-top: 25px; position: relative; display: none")
                                        .col-xs-12
                                            .progress
                                                .progress-bar.progress-bar-success(role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;min-width: 2em;") 0%
                     .col-md-4.col-md-offset-4.text-right
                        ul.pagination
                           li
                              a(href='#' aria-label='Previous')
                                 span(aria-hidden='true') &laquo;
                           li
                              a ...
                           li
                              a(href='#') 1
                           li
                              a(href='#') 2
                           li
                              a(href='#') 3
                           li
                              a(href='#') 4
                           li
                              a(href='#') 5
                           li
                              a(href='#' aria-label='Next')
                                 span(aria-hidden='true') &raquo;
      footer.footer
         .container
            p.text-muted.text-center © gikoo 2013-2015
      script(src='http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js')
      script(src='http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js')
      script(src='/javascripts/app-detail-view.js')
      script(src='/javascripts/jquery.ui.widget.js')
      script(src='/javascripts/jquery.iframe-transport.js')
      script(src='/javascripts/jquery.fileupload.js')
      script(src='/javascripts/app-upload.js')
      script(src='/javascripts/workstation-init.js')